<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>报表</title>
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta http-equiv="Expires" CONTENT="0">
    <meta http-equiv="Cache-Control" content="no-siteapp,no-transform,no-store, no-cache, must-revalidate">
    <meta http-equiv="Pragma" content="no-cache">
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon"/>
    <link rel="stylesheet" href="/static/css/font.css">
    <link rel="stylesheet" href="/lib/swiper/swiper-5.css" />
    <link rel="stylesheet" href="/static/css/weadmin.css">
    <script type="text/javascript" src="/lib/layui/layui.js" charset="utf-8"></script>
    <link rel="stylesheet" href="/static/css/buildUnit/common.css">
    <link rel="stylesheet" href="echartstab.css">
    <style>
        body{
            background-image:url('/static/images/echartbg.png');
            background-position: 0 0;
            background-size:100%;
        }
        .echartmain{
            width:100%;
            height:100%;
        }
        .toptime{
            font-size:18px;
            color:#fff;
            height:24px;
            text-align: right;
            padding-right:60px;
            padding-top:14px;
        }
        .echartmain .layui-tab .layui-tab-title{
            width:970px;
            height:58px;
            margin:50px auto 0;
            color:#fff;
            background-image: url("/static/images/tabbg.png");
            background-size:100%;
            background-repeat:no-repeat;
            border:0;
            padding-left:446px;
            overflow:inherit;
            position: relative;
        }
        .layui-tab .layui-tab-title li:after{
            border:0;
        }
        .layui-tab .layui-tab-title li{
            width:81px;
            height:20px;
            position: relative;
            padding:25px 12px 0;
        }
        .layui-tab .layui-tab-title li img{
            width:81px;
            height:20px;
            position: absolute;
            left:12px;
            bottom:0;
        }
        .layui-tab-title .layui-this:after{display: none}
        .layui-tab-title li img:last-child{
            display: none;
        }
        .layui-tab-title .layui-this img:first-child{
            display: none;
        }
        .layui-tab-title .layui-this img:last-child{
            display: block;
        }
        .layui-tab{
            height:auto;
        }
        /*.layui-tab-content{*/
        /*    background:#0aa;*/
        /*    margin-top:30px;*/
        /*    padding:0;*/
        /*}*/
        .indexbtn{
            font-size:20px;
            color:#00e4ff;
            font-weight: bolder;
            background:none;
            border:0;
            position: absolute;
            top:25px;
            left:-140px;
            cursor: pointer;
        }
        .thisclosebtn{
            font-size:20px;
            color:#00e4ff;
            font-weight: bolder;
            background:none;
            border:0;
            position: absolute;
            right:-100px;
            top:25px;
            border-bottom:2px solid #00e4ff;
            cursor: pointer;
        }
        .layui-tab-bar{display: none}
        .layui-tab-item{
            overflow-y: auto;
        }
        .bing{
            width:400px;
            height:300px;
            border:1px solid #ccc;
        }
        .table{
            border:1px solid #f00;
        }
        h2{
            text-align: center;
            color: #02e4ff;
        }
        .load{
            width:100%;
            height:100%;
            background:rgba(0,0,0,0.4);
            position: fixed;
            left:0;top:0;
            z-index: 100;
        }
        .load div{
            width:200px;
            height:100px;
            background:#fff;
            border-radius: 6px;
            position: absolute;
            left:0;
            right:0;
            top:0;
            bottom:0;
            margin: auto;
        }
        .load div p{
            height:50px;
            line-height: 50px;
            text-align: center;
            border-bottom:1px solid #ccc;
        }
        .load div button{
            border:0;
            background:none;
            width:200px;
            height:50px;
            cursor: pointer;
        }
    </style>
</head>
<body id="thispage">
<!--<div class="load">-->
    <!--<div>-->
        <!--<p>大数据分析需要全屏展示</p>-->
        <!--<button id="fullpage">确定</button>-->
    <!--</div>-->
<!--</div>-->
<div class="echartmain" id="echartmain">
    <p class="toptime"></p>
    <div class="layui-tab" lay-filter="filter">
        <ul class="layui-tab-title clf">
            <button class="indexbtn" id="indexbtn">首页</button>
            <li class="layui-this"><img src="/static/images/tab/tab-1-1.png" /><img src="/static/images/tab/tab-1-2.png" /></li>
            <li><img src="/static/images/tab/tab-2-1.png" /><img src="/static/images/tab/tab-2-2.png" /></li>
            <li><img src="/static/images/tab/tab-3-1.png" /><img src="/static/images/tab/tab-3-2.png" /></li>
            <li><img src="/static/images/tab/tab-4-1.png" /><img src="/static/images/tab/tab-4-2.png" /></li>
            <li><img src="/static/images/tab/tab-5-1.png" /><img src="/static/images/tab/tab-5-2.png" /></li>
            <!--<li><img src="/static/images/tab/tab-6-1.png" /><img src="/static/images/tab/tab-6-2.png" /></li>-->
            <button class="thisclosebtn">退出</button>
        </ul>
        <div class="layui-tab-content">

            <!-- 总体统计 -->
            <div class="layui-tab-item zttj  layui-show"><br>
                <div class="title" style="text-align: center;font-size: 30px;color: #fe559f">
                    总工程数：<div></div>  &nbsp;&nbsp;&nbsp;
                    竣工工程数：<div></div> &nbsp;&nbsp;&nbsp;
                    中止施工工程数：<div></div>
                </div>
                <br>
                <div class="clf">
                    <div class="one-left">
                        <div id="map"></div>
                    </div>
                    <div class="one-right">
                        <div class="one-r-top clf">
                            <div class="swiper-container one-swiper ">
                                <div class="swiper-wrapper">
                                    <div class="swiper-slide " data-name="zlys">
                                        <h3>各市质量验收数</h3>
                                        <div class="onezhu zlys" ></div>
                                    </div>
                                    <div class="swiper-slide " data-name="zlxc">
                                        <h3>各市质量巡查数</h3>
                                        <div class="onezhu zlxc" ></div>
                                    </div>
                                    <div class="swiper-slide " data-name="jgys">
                                        <h3>各市竣工验收数</h3>
                                        <div class="onezhu jgys" ></div>
                                    </div>
                                </div>
                            </div>
                            <div class="one-r-top2">
                                <h3>企业项目数TOP5</h3>
                                <div id="topfive"></div>
                            </div>
                        </div>
                        <div class="one-r-bot">
                            <h3>各市综合统计</h3>
                            <table>
                                <colgroup>
                                    <col width="138">
                                    <col width="138">
                                    <col width="138">
                                    <col width="138">
                                    <col width="138">
                                </colgroup>
                                <thead>
                                <tr>
                                    <th>序号</th>
                                    <th>地区名</th>
                                    <th>项目总数</th>
                                    <th>总面积(m²)</th>
                                    <th>总造价(万元)</th>
                                </tr>
                                </thead>
                            </table>
                            <div class="onezhtjdiv">
                                <table>
                                    <colgroup>
                                        <col width="138">
                                        <col width="138">
                                        <col width="138">
                                        <col width="138">
                                        <col width="138">
                                    </colgroup>
                                    <tbody id="onezhtj"></tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!-- 项目分析 -->
            <div class="layui-tab-item xmfx ">
                <br>
                <div class="title" style="text-align: center;font-size: 30px;color: #fe559f">
                    重点项目数：<div></div>  &nbsp;&nbsp;&nbsp;
                    装配式建筑数：<div></div> &nbsp;&nbsp;&nbsp;
                    被动房建筑数：<div></div>
                </div>
                <br><br>

                <div class="clf">
                    <div class="twoleft">
                        <div>
                            <h3><b class="lingxing"></b>各市项目数占比</h3>
                            <div id="twoleft1"></div>
                        </div>
                        <div>
                            <h3><b class="lingxing"></b>各市投资额占比</h3>
                            <div id="twoleft3"></div>
                        </div>
                        <div>
                            <h3><b class="lingxing"></b>各市面积占比</h3>
                            <div id="twoleft2"></div>
                        </div>
                    </div>
                    <div class="twocenter">
                        <div class="swiper-container ctop echart-swiper">
                            <div class="swiper-wrapper">
                                <div class="swiper-slide" data-name="xmqs">
                                    <h3>年度项目数趋势</h3>
                                    <div class="ctopline xmqs" ></div>
                                </div>
                                <div class="swiper-slide" data-name="jeqs">
                                    <h3>年度金额趋势</h3>
                                    <div class="ctopline jeqs" ></div>
                                </div>
                                <div class="swiper-slide" data-name="mjqs">
                                    <h3>年度面积趋势</h3>
                                    <div class="ctopline mjqs" ></div>
                                </div>
                            </div>
                        </div>
                        <div class="cbot">
                            <table class="layui-table">
                                <colgroup>
                                    <col width="138">
                                    <col width="138">
                                    <col width="138">
                                    <col width="138">
                                    <col width="138">
                                </colgroup>
                                <thead>
                                <tr>
                                    <th>序号</th>
                                    <th>地区名</th>
                                    <th>项目总数</th>
                                    <th>装配式建筑个数</th>
                                    <th>被动房建筑个数</th>
                                </tr>
                                </thead>
                            </table>
                            <div class="cbottable">
                                <table class="layui-table">
                                    <colgroup>
                                        <col width="138">
                                        <col width="138">
                                        <col width="138">
                                        <col width="138">
                                        <col width="138">
                                    </colgroup>
                                    <tbody id="projectFb"></tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="tworight">
                        <div class="twor1">
                            <h3>本月新增项目数</h3>
                            <ul class="clf">
                                <li><span>12个</span>项目数</li>
                                <li><span>12个</span>装配式</li>
                                <li><span>12个</span>被动房</li>
                            </ul>
                        </div>
                        <div class="twor2">
                            <h3>装配饰、被动房建筑走势</h3>
                            <div id="zbAnnualTrend" style="height:190px;"></div>
                        </div>
                        <div class="twor3">
                            <div class="swiper-container" id="test1">
                                <div class="swiper-wrapper">
                                    <div class="swiper-slide">
                                        <h3>工程规模分析站表</h3>
                                        <div class="tworbot" id="gmfx"></div>
                                    </div>
                                    <div class="swiper-slide">
                                        <h3>工程用途分析站表</h3>
                                        <div class="tworbot" id="ytfx"></div>
                                    </div>
                                </div>
                                <!-- Add Arrows -->
                                <div class="swiper-button-next"></div>
                                <div class="swiper-button-prev"></div>
                            </div>
                        </div>
                    </div>
                </div>

            </div>

            <!-- 质量巡查 -->
            <div class="layui-tab-item">
                <div class="threetop clf">
                    <div>
                        <h3>问题状态</h3>
                        <div id="qlyInsCountGroupByStatus"></div>
                    </div>
                    <div>
                        <h3>问题等级</h3>
                        <div id="queCountGroupByLevel"></div>
                    </div>
                    <div>
                        <h3>问题类型</h3>
                        <div id="queCountGroupByType"></div>
                    </div>
                </div>
                <div class="threebot clf">
                    <div class="threebot-left">
                        <h3>今日巡查数</h3>
                        <ul class="clf">
                            <li><span></span>一般问题数</li>
                            <li><span></span>较大问题数</li>
                            <li><span></span>严重问题数</li>
                        </ul>
                    </div>
                    <div class="threebot-right">
                        <div class="threebot-right-l">
                            <h3>各市质量巡查次数排名</h3>
                            <table>
                                <colgroup>
                                    <col width="138">
                                    <col width="138">
                                    <col width="138">
                                </colgroup>
                                <thead>
                                    <tr>
                                        <th>序号</th>
                                        <th>地区名</th>
                                        <th>巡查次数</th>
                                    </tr>
                                </thead>
                            </table>
                            <div class="threebot-right-tab">
                                <table>
                                    <colgroup>
                                        <col width="138">
                                        <col width="138">
                                        <col width="138">
                                    </colgroup>
                                    <tbody id="xuncha">
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        <div class="threebot-right-r">
                            <h3>各市超期未整改排名</h3>
                            <table>
                                <colgroup>
                                    <col width="138">
                                    <col width="138">
                                    <col width="138">
                                    <col width="138">
                                </colgroup>
                                <thead>
                                <tr>
                                    <th>序号</th>
                                    <th>地区名</th>
                                    <th>超期未整改数量</th>
                                    <th>平均超期时长（天）</th>
                                </tr>
                                </thead>
                            </table>
                            <div class="threebot-right-tab">
                                <table>
                                    <colgroup>
                                        <col width="138">
                                        <col width="138">
                                        <col width="138">
                                        <col width="138">
                                    </colgroup>
                                    <tbody id="overtime">
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!-- 质量验收 -->
            <div class="layui-tab-item  fouritem clf">
                <div class="four-left">
                    <div class="four-left-top">
                        <h3><b class="lingxing"></b><i class="fouryear"></i>验收类型统计</h3>
                        <div id="qlyAccCountGroupByType"></div>
                    </div>
                    <div class="four-left-bot">
                        <h3><b class="lingxing"></b><i class="fouryear"></i>项目类型验收统计</h3>
                        <div id="qlyAccCountGroupByYear"></div>
                    </div>
                </div>
                <div class="four-right">
                    <div class="four-r-top clf">
                        <div class="swiper-container four-swiper">
                            <div class="swiper-wrapper">
                                <div class="swiper-slide " data-name="four1">
                                    <h3>验收年份统计</h3>
                                    <div class="fourslide" ></div>
                                </div>
                                <div class="swiper-slide " data-name="four2">
                                    <h3>验收2</h3>
                                    <div class="fourslide" ></div>
                                </div>
                                <div class="swiper-slide " data-name="four3">
                                    <h3>验收3</h3>
                                    <div class="fourslide" ></div>
                                </div>
                            </div>
                        </div>
                        <div class="todaynum">
                            <h3>今日验收数量</h3>
                            <div>
                                <span>12个</span>
                                正在进行
                            </div>
                        </div>
                    </div>
                    <div class="four-r-bot">
                        <h3><i class="fouryear"></i>各市质量验收类型综合统计排名</h3>
                        <div class="threebot-right-tab" style="width:1283px;">
                            <table id="fourtable"></table>
                        </div>
                    </div>
                </div>
            </div>

            <!-- 竣工验收 -->
            <div class="layui-tab-item fouritem fiveitem clf">
                <div class="four-left">
                    <div class="four-left-top">
                        <h3><b class="lingxing"></b><i class="fiveyear"></i>竣工验收数量</h3>
                        <div id="cptAccCountGroupByYear"></div>
                    </div>
                    <div class="four-left-bot">
                        <h3><b class="lingxing"></b><i class="fiveyear"></i>项目类型竣工占比</h3>
                        <div id="cptAccCountGroupByPrjCategory"></div>
                    </div>
                </div>
                <div class="four-right">
                    <div class="four-r-top clf">
                        <div class="swiper-container four-swiper five-swiper">
                            <div class="swiper-wrapper">
                                <div class="swiper-slide " data-name="five1">
                                    <h3>年度质量验收数量</h3>
                                    <div class="five-slide" ></div>
                                </div>
                                <div class="swiper-slide " data-name="five2">
                                    <h3>年度2</h3>
                                    <div class="five-slide" ></div>
                                </div>
                                <div class="swiper-slide " data-name="five3">
                                    <h3>年度3</h3>
                                    <div class="five-slide" ></div>
                                </div>
                            </div>
                        </div>
                        <div class="todaynum">
                            <h3>今日数量</h3>
                            <ul class="clf">
                                <li>
                                    <span>1</span>竣工申请
                                </li>
                                <li>
                                    <span>1</span>完成竣工
                                </li>
                                <li>
                                    <span>1</span>竣工驳回
                                </li>
                            </ul>
                            <div>
                                <p><span></span>竣工申请</p>
                                <p><span></span>完成竣工</p>
                                <p><span></span>竣工驳回</p>
                            </div>
                        </div>
                    </div>
                    <div class="four-r-bot">
                        <h3><i class="fiveyear"></i>各市竣工验收统计</h3>
                        <div class="threebot-right-tab" style="width:866px;">
                            <table id="fivetable"></table>
                        </div>
                    </div>
                </div>
            </div>

            <!-- 企业分析 -->
            <!--<div class="layui-tab-item"><table>-->
                <!--<tr>-->
                    <!--<td class="bing" id="yearPrjCountOfCompany"></td>-->
                    <!--<td>-->
                        <!--<div class="table" style="width:500px;">-->
                            <!--<h2>各企业在建项目数排名</h2>-->
                            <!--<table id="zlys" lay-filter="test"></table>-->
                        <!--</div>-->
                    <!--</td>-->
                    <!--<td>-->
                        <!--<div class="table" style="width:500px;">-->
                            <!--<h2>各市在建项目数排名</h2>-->
                            <!--<table id="szjpm" lay-filter="test"></table>-->
                        <!--</div>-->
                    <!--</td>-->
                <!--</tr>-->
            <!--</table></div>-->
        </div>
    </div>
</div>



<script src="/static/js/main.js"></script>
<script src="/lib/swiper/swiper-5.js"></script>
<script src="/static/js/echarts.min.js"></script>
<script>
    //全屏
    // var enterFullscreen = function(el) {
    //     return new Promise(function(res,err){
    //         if (el.requestFullscreen) {
    //             el.requestFullscreen();
    //         } else if (el.msRequestFullscreen) {
    //             el.msRequestFullscreen();
    //         } else if (el.mozRequestFullScreen) {
    //             el.mozRequestFullScreen();
    //         } else if (el.webkitRequestFullscreen) {
    //             el.webkitRequestFullscreen();
    //         }
    //         res();
    //     });
    // };
    //获取时间
    function getNowDate(){
        var date = new Date();
        var year = date.getFullYear();
        var month = date.getMonth() + 1;
        var date1 = date.getDate();
        var day = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六")[date.getDay()];
        var hour = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
        var minute = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
        var second = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
        var currentTime = year + "年" + month + "月" + date1 + "日 " + " " + day;
        console.log('currentTime',currentTime);
        return currentTime;
    }

    layui.use(['jquery','element','form','configureCom','configure','echartsCom','table', 'carousel'],function(){
        var $ = layui.jquery;
        var carousel = layui.carousel;
        var element = layui.element;
        var table = layui.table;
        var form = layui.form;
        var configureCom = layui.configureCom;
        var echartsCom = layui.echartsCom;

        // $('#fullpage').on('click',function(e){
        //     e.preventDefault();
        //     $('.load').hide();
        //     enterFullscreen(document.documentElement).then(function(){
        //         setTimeout(function(){
        //             var bheight = $('body').height();
        //             var timeheight = $('.toptime').height() + 14;
        //             var titheight = $('.layui-tab-title').height() + 50;
        //             $('.load p').html(bheight - timeheight - titheight - 30);
        //             $('.layui-tab-content .layui-tab-item').css('height',bheight - timeheight - titheight - 30 + 'px');
        //         },100);
        //     });
        // });

        var baseQueryData = {
            "provinceNum": "130000",
            "years": "2020"
        };



        var markdata=[];//这是为了给地图上添加气泡图标,拿取备用数据
        var valuess= [];

        //生成地图
        function createMap(data){
            echarts.registerMap('hebei',data);
            var chart = echarts.init(document.getElementById('map'));
            chart.setOption({
                dataRange: {
                    min: 0,//颜色区间的最小值
                    max: 50,//颜色区间的最大值，和data中的最大值一致
                    x: 'left',
                    y: 'bottom',
                    text:['高','低'], // 文本，默认为数值文本
                    calculable : true,
                    inRange: {
                        //颜色区间
                        color: ['#053750']
                    }
                },
                tooltip : {
                    show:true,
                    formatter: '在建工程<br /> {b}: {c0}'
                },
                label:{
                    color:'#fff'
                },
                series: [{
                    type: 'map',
                    map: 'hebei',
                    label:{
                        show:true,
                        color:'#fff'
                    },
                    itemStyle:{
                        borderColor: "#01bbe3",
                        borderWidth: 1,
                    },
                    emphasis:{
                        label:{
                            show:true,
                        }
                    },
                    data:markdata,
                    markPoint:{
                        symbol: 'circle',
                        symbolSize: 50,
                        itemStyle: {
                            normal: {
                                borderColor: '#33CBFF',
                                color:'#33CBFF',
                                borderWidth: 1,            // 标注边线线宽，单位px，默认为1
                                label: {
                                    show: true
                                }
                            }
                        },
                        data:markdata
                    }
                }]
            });
        }

        //处理整合   气泡图标数据
        function convertData(arrs){
            var markdata=[];
            //按照顺序显示数量[石家庄、.....]
            // var valuess=[500000,20,0,30,15,25,48,10,5,38];
            for(var i=0; i<arrs.length; i++){
                markdata.push({})
                if(arrs[i].properties.name=='石家庄市'){
                    markdata[i].coord=new Array(parseFloat(arrs[i].properties.center[0])+0.1,parseFloat(arrs[i].properties.center[1])-0.18);
                    console.log(markdata[i])
                }else{
                    markdata[i].coord=arrs[i].properties.center;
                }
                markdata[i].name=arrs[i].properties.name;

                markdata[i].value=valuess[i]
            }
            return markdata
        }







        var ctopIndex = 0;
        var oneIndex = 0;
        var fourIndex = 0;
        var fiveIndex = 0;
        var fourYear = '2020';//质量验收  年份
        var fourQueryData = {"provinceNum": "130000", "years": "2020"};
        var fiveYear = '2020';//竣工验收  年份
        var fiveQueryData = {"provinceNum": "130000", "years": "2020"};
        element.on('tab(filter)', function(data){
            if(data.index == 0){//总体统计
                window.zttjgetFun();
            }
            if(data.index == 1){//项目分析
                window.twotitle();
                window.twoleftFun();
                window.tworightFun();
            }
            if(data.index == 2){//质量巡查
                window.threeTopFun();
            }
            if(data.index == 3){//质量验收
                fourYear = '2020';
                window.zlysGetFun();
                window.fourGetYearFun();
            }
            if(data.index == 4){//竣工验收
                fiveYear = '2020';
                $('.fiveyear').html('2020年');
                window.fiveGetFun();
                var fiveSwiper = new Swiper('.five-swiper', {
                    slidesPerView: 1.5,
                    spaceBetween: 30,
                    centeredSlides: true,
                    loop: true,
                    // autoplay: {
                    //     delay: 5000,
                    //     disableOnInteraction: false,
                    // },
                    on:{
                        init: function(){
                            //Swiper初始化了
                            fiveIndex = this.activeIndex;
                            window.fiveGetFun1();
                        },
                        slideChange: function(){
                            fiveIndex = this.activeIndex;
                            var name = this.$el.find('.swiper-slide').eq(fiveIndex).attr('data-name');
                            if(name == 'five1'){
                                window.fiveGetFun1();
                            }else if(name == 'five2'){

                            }else if(name == 'five3'){

                            }
                        },
                    }
                });

                //今日数据
                configureCom.noloadpostAjax('/api/report/cpt/acc/today',{}).then(function(res){
                    var data = res.data;
                    $('.fiveitem .todaynum li:nth-of-type(1) span').html(data.cptAccCount + '个');
                    $('.fiveitem .todaynum li:nth-of-type(2) span').html(data.finishCount + '个');
                    $('.fiveitem .todaynum li:nth-of-type(3) span').html(data.rejectCount + '个');
                });
            }
        });
        /*
        * 竣工验收
        * */
        window.fiveGetFun1 = function(){
            //竣工验收数 - 默认:柱状图
            var cptAccCountGroupByYear = echarts.init($('.five-slide')[fiveIndex]);
            configureCom.noloadpostAjax('/api/report/cpt/acc/cptAccCountGroupByYear',{"provinceNum": "130000", "years": "2016-2020"}).then(function(res){
                var data = res.data;
                var xArr = [];
                $.each(data,function(i, item){
                    xArr.push(item.name);
                });
                var yArr = [];
                $.each(data,function(i, item){
                    yArr.push(item.value);
                });
                echartsCom.zhu( '',xArr, '竣工验收数', yArr).then(function(option){
                    cptAccCountGroupByYear.setOption(option);
                });
            });
            cptAccCountGroupByYear.on('click',function(e){
                fiveQueryData.years = e.name;
                $('.fiveyear').html(e.name+'年');
                window.fiveGetFun();
            });
        };
        window.fiveGetFun = function(){
            //竣工驗收统计 - 默认:表格
            var cols = [[ //表头
                {type:'numbers',title:'序号', width:142},
                {field: 'district', title: '地区名', width:142},
                {field: 'cptAccCount', title: '验收总次数', width:142},
                {field: 'cptAccArea', title: '竣工面积（m2）', width:142},
                {field: 'oncePassTimes', title: '一次性通过次数', width:142},
                {field: 'oncePassRate', title: '一次性通过率', width:142, templet:function(d){
                        return d.oncePassRate * 100 + '%'
                    }
                }
            ]];
            configureCom.newtableRenderNoPage('#fivetable', '/api/report/cpt/acc/distribute',fiveQueryData,cols);
            //某年每个月竣工验收数 - 默认:柱状图
            var five1 = echarts.init(document.getElementById('cptAccCountGroupByYear'));
            configureCom.noloadpostAjax('/api/report/cpt/acc/cptAccCountGroupByMonth',fiveQueryData).then(function(res){
                var data = res.data;
                var xArr = [];
                $.each(data,function(i, item){
                    xArr.push(item.name + '月');
                });
                var yArr = [];
                $.each(data,function(i, item){
                    yArr.push(item.value);
                });
                echartsCom.zhu( '',xArr, '月竣工验收数', yArr).then(function(option){
                    five1.setOption(option);
                });
            });
            //项目类型竣工
            var cptAccCountGroupByPrjCategory = echarts.init(document.getElementById('cptAccCountGroupByPrjCategory'));
            configureCom.noloadpostAjax('/api/report/cpt/acc/cptAccCountGroupByPrjCategory',fiveQueryData).then(function(res){
                $.each(res.data,function(i,val){
                    val.value = parseInt(val.value);
                });

                echartsCom.bing('',res.data, '', 60).then(function(option){
                    cptAccCountGroupByPrjCategory.setOption(option);
                });
            });
        };
        /*
        质量验收
        * */
        window.fourSwiper1 = function(){
            //验收年份统计 - 默认:柱状图
            var myChart8 = echarts.init($('.fourslide')[fourIndex]);
            configureCom.noloadpostAjax('/api/report/qly/acc/qlyAccCountGroupByYear',{"provinceNum": "130000", "years": "2016-2020"}).then(function(res){
                var data = res.data;
                var xArr = [];
                $.each(data,function(i, item){
                    xArr.push(item.name);
                });
                var yArr = [];
                $.each(data,function(i, item){
                    yArr.push(item.value);
                });
                echartsCom.zhu( '',xArr, '验收年份统计', yArr).then(function(option){
                    myChart8.setOption(option);
                });
            });
            myChart8.on('click',function(e){
                fourQueryData.years = e.name;
                $('.fouryear').html(e.name+'年');
                window.fourGetYearFun();
            });
        };
        window.zlysGetFun = function(){
            $('.fouryear').html('2020年');
            var fourSwiper = new Swiper('.four-swiper', {
                slidesPerView: 1.5,
                spaceBetween: 30,
                centeredSlides: true,
                loop: true,
                // autoplay: {
                //     delay: 5000,
                //     disableOnInteraction: false,
                // },
                on:{
                    init: function(){
                        //Swiper初始化了
                        fourIndex = this.activeIndex;
                        window.fourSwiper1();
                    },
                    slideChange: function(){
                        fourIndex = this.activeIndex;
                        var name = this.$el.find('.swiper-slide').eq(fourIndex).attr('data-name');
                        if(name == 'four1'){
                            window.fourSwiper1();
                        }else if(name == 'four2'){

                        }else if(name == 'four3'){

                        }
                    },
                }
            });
            configureCom.noloadpostAjax('/api/report/qly/acc/today',{}).then(function(res){
                if(res.data != ''){
                    $('.four-right .todaynum > div > span').html(res.data.qlyAccCount + '个');
                }
            });
        };
        window.fourGetYearFun = function(){
            //各市质量验收类型综合统计排名 - 默认:表格
            var cols = [[ //表头
                {type:'numbers',title:'序号', width:142 },
                {field: 'name', title: '地区名称', width:142},
                {field: 'djgcCount', title: '地基工程', width:142},
                {field: 'fsgcCount', title: '防水工程', width:142},
                {field: 'gjybgcCount', title: '钢筋隐蔽工程', width:142},
                {field: 'hntgcCount', title: '混凝土工程', width:142},
                {field: 'wmgcCount', title: '屋面工程', width:142},
                {field: 'otherCount', title: '其他', width:142},
                {field: 'sum', title: '总计', width:142}
            ]];
            configureCom.newtableRenderNoPage('#fourtable', '/api/report/qly/acc/cityRanking', fourQueryData, cols);
            //验收类型统计 - 默认:柱状图
            var myChart7 = echarts.init(document.getElementById('qlyAccCountGroupByType'));
            configureCom.noloadpostAjax('/api/report/qly/acc/qlyAccCountGroupByType',fourQueryData).then(function(res){
                var data = res.data;
                var xArr = [];
                $.each(data,function(i, item){
                    xArr.push(item.name);
                });
                var yArr = [];
                $.each(data,function(i, item){
                    yArr.push(item.value);
                });
                echartsCom.zhu( '',xArr, '验收类型统计', yArr).then(function(option){
                    myChart7.setOption(option);
                });
            });
            // 项目类型验收统计 - 默认:饼图
            var four1 = echarts.init(document.getElementById('qlyAccCountGroupByYear'));
            configureCom.noloadpostAjax('/api/report/qly/acc/qlyAccCountGroupByPrjCategory',fourQueryData).then(function(res){
                $.each(res.data,function(i,val){
                    val.value = parseInt(val.value);
                });
                echartsCom.bing('',res.data, '', 60).then(function(option){
                    four1.setOption(option);
                });
            });
        };
        /*
        总体统计
        * */
        window.zttjgetFun = function(){
            configureCom.noloadpostAjax('/api/report/main/banner',{}).then(function(res){
                if(res.code == 0){
                    var data = res.data;
                    var parentId = '';
                    $.each(data,function(key, item){
                        var arr = item.toString().split('');
                        var html = '';
                        $.each(arr,function(index, val){
                            html += '<span>'+val+'</span>';
                        });
                        if(key == 'prjCount'){
                            parentId = $('.zttj .title div:nth-of-type(1)');
                        }else if(key == 'cptCount'){
                            parentId = $('.zttj .title div:nth-of-type(2)');
                        }else{
                            parentId = $('.zttj .title div:nth-of-type(3)');
                        }
                        parentId.html(html);
                    });
                }
            });


            var swiper = new Swiper('.one-swiper', {
                slidesPerView: 1.4,
                spaceBetween: 30,
                centeredSlides: true,
                loop: true,
                autoplay: {
                    delay: 5000,
                    disableOnInteraction: false,
                },
                on:{
                    init: function(){
                        //Swiper初始化了
                        oneIndex = this.activeIndex;
                        window.oneGetzlxc();
                    },
                    slideChange: function(){
                        oneIndex = this.activeIndex;
                        var name = this.$el.find('.swiper-slide').eq(oneIndex).attr('data-name');
                        if(name == 'zlxc'){
                            window.oneGetzlxc();
                        }else if(name == 'zlys'){
                            window.oneGetzlys();
                        }else if(name == 'jgys'){
                            window.oneGetjgys()
                        }
                    },
                }
            });
            //各市综合统计
            configureCom.noloadpostAjax('/api/report/main/prjInfoByCity',{"provinceNum": "130000", "years": "2016-2020"}).then(function(res){
                var html = '';
                var data = res.data;
                $.each(data, function(i, item){
                    valuess.push(item.prjCount);
                    html += '<tr>' +
                        '        <td>'+(i+1)+'</td>' +
                        '        <td>'+item.district+'</td>' +
                        '        <td>'+item.prjCount+'</td>' +
                        '        <td>'+item.totalArea+'</td>' +
                        '        <td>'+item.totalInvestment+'</td>' +
                        '   </tr>'
                });
                $('#onezhtj').html(html);

                //取得json的样式，读取json文件
                $.getJSON("mapData/hebei/datas.json", "", function(data) {
                    markdata=convertData(data.features);
                    //生成地图
                    createMap(data);
                });
            });
            window.topfiveFun();
        };
        window.topfiveFun = function(){
            //企业top5
            var topfive = echarts.init($('#topfive')[0]);
            configureCom.noloadpostAjax('/api/report/main/sgdwPrjCountTop5',{"provinceNum": "130000", "years": "2016-2020"}).then(function(res) {
                var data = res.data;
                var xdata = [];
                $.each(data, function (i, item) {
                    xdata.push(item.name);
                });
                var arr = [];
                $.each(data, function (i, item) {
                    arr.push(parseInt(item.value));
                });
                echartsCom.zhu('', xdata, '', arr).then(function (option) {
                    topfive.setOption(option);
                });
            });
        };
        window.oneGetzlxc = function(){
            //各市质量巡查数
            var zlxc = echarts.init($('.zttj .onezhu')[oneIndex]);
            configureCom.noloadpostAjax('/api/report/main/qlyInsCountGroupByCity',{"provinceNum": "130000", "years": "2016-2020"}).then(function(res) {
                var data = res.data;
                var xdata = [];
                $.each(data, function (i, item) {
                    xdata.push(item.name);
                });
                var arr = [];
                $.each(data, function (i, item) {
                    arr.push(parseInt(item.value));
                });
                echartsCom.zhu('', xdata, '', arr, true).then(function (option) {
                    zlxc.setOption(option);
                });
            });
        };
        window.oneGetzlys = function(){
            //各市质量验收数
            var zlys = echarts.init($('.zttj .onezhu')[oneIndex]);
            configureCom.noloadpostAjax('/api/report/main/qlyAccCountGroupByCity',{"provinceNum": "130000", "years": "2016-2020"}).then(function(res) {
                var data = res.data;
                var xdata = [];
                $.each(data, function (i, item) {
                    xdata.push(item.name);
                });
                var arr = [];
                $.each(data, function (i, item) {
                    arr.push(parseInt(item.value));
                });
                echartsCom.zhu('', xdata, '', arr, true).then(function (option) {
                    zlys.setOption(option);
                });
            });
        };
        window.oneGetjgys = function(){
            //各市竣工验收数
            var jgys = echarts.init($('.zttj .onezhu')[oneIndex]);
            configureCom.noloadpostAjax('/api/report/main/cptAccCountGroupByCity',{"provinceNum": "130000", "years": "2016-2020"}).then(function(res) {
                var data = res.data;
                var xdata = [];
                $.each(data, function (i, item) {
                    xdata.push(item.name);
                });
                var arr = [];
                $.each(data, function (i, item) {
                    arr.push(parseInt(item.value));
                });
                echartsCom.zhu('', xdata, '', arr, true).then(function (option) {
                    jgys.setOption(option);
                });
            });
        };
        window.zttjgetFun();
        /*
        * 质量巡查
        * */
        window.threeTopFun = function(){
            // 隐患状态等级占比 - 默认:饼图
            var myChart4 = echarts.init(document.getElementById('qlyInsCountGroupByStatus'));
            configureCom.noloadpostAjax('/api/report/qly/ins/qlyInsCountGroupByStatus',baseQueryData).then(function(res){
                echartsCom.bing('',res.data).then(function(option){
                    myChart4.setOption(option);
                });
            });
            //质量问题等级占比 - 默认:饼图
            var myChart5 = echarts.init(document.getElementById('queCountGroupByLevel'));
            configureCom.noloadpostAjax('/api/report/qly/ins/queCountGroupByLevel',baseQueryData).then(function(res){
                echartsCom.bing('',res.data).then(function(option){
                    myChart5.setOption(option);
                });
            });
            //质量问题类型占比 - 默认:饼图
            var myChart6 = echarts.init(document.getElementById('queCountGroupByType'));
            configureCom.noloadpostAjax('/api/report/qly/ins/queCountGroupByType',baseQueryData).then(function(res){
                echartsCom.bing('',res.data).then(function(option){
                    myChart6.setOption(option);
                });
            });
            //今日巡查数据
            configureCom.noloadpostAjax('/api/report/qly/ins/today',{}).then(function(res){
                if(res.data != ''){
                    $('.threebot-left li:nth-of-type(1) span').html(res.data.generalCount + '个');
                    $('.threebot-left li:nth-of-type(2) span').html(res.data.largerCount + '个');
                    $('.threebot-left li:nth-of-type(3) span').html(res.data.seriousCount + '个');
                }
            });
            //各市质量巡查次数排名 - 默认:表格
            configureCom.noloadpostAjax('/api/report/qly/ins/qlyInsCountGroupByCity',baseQueryData).then(function(res){
                var html = '';
                var data = res.data;
                $.each(data, function(i, item){
                    html += '<tr>' +
                        '        <td>'+(i+1)+'</td>' +
                        '        <td>'+item.district+'</td>' +
                        '        <td>'+item.qlyInsCount+'</td>' +
                        '   </tr>'
                });
                $('#xuncha').html(html);
            });
            ///各市超期未整改排名 - 默认:表格
            configureCom.noloadpostAjax('/api/report/qly/ins/cityOverdueRanking',baseQueryData).then(function(res){
                var html = '';
                var data = res.data;
                $.each(data, function(i, item){
                    html += '<tr>' +
                        '        <td>'+(i+1)+'</td>' +
                        '        <td>'+item.name+'</td>' +
                        '        <td>'+item.overdueCount+'</td>' +
                        '        <td>'+item.avgOverdueDays+'</td>' +
                        '   </tr>'
                });
                $('#overtime').html(html);
            });
        };
        /*
        * 项目分析
        * */
        window.twotitle = function(){
            configureCom.noloadpostAjax('/api/report/prj/yearPrjCount',baseQueryData).then(function(res){
                if(res.code == 0){
                    var data = res.data;
                    var parentId = '';
                    $.each(data,function(key, item){
                       var arr = item.toString().split('');
                       var html = '';
                       $.each(arr,function(index, val){
                            html += '<span>'+val+'</span>';
                       });
                       if(key == 'importantPrjCount'){
                           parentId = $('.xmfx .title div:nth-of-type(1)');
                       }else if(key == 'zpsCount'){
                           parentId = $('.xmfx .title div:nth-of-type(2)');
                       }else{
                           parentId = $('.xmfx .title div:nth-of-type(3)');
                       }
                        parentId.html(html);
                    });
                }
            });
        };
        window.twoleftFun = function(){
            //各市项目数占比
            var twoEchart1 = echarts.init(document.getElementById('twoleft1'));
            configureCom.noloadpostAjax('/api/report/prj/prjCountGroupByCity',baseQueryData).then(function(res){
                echartsCom.bing('',res.data).then(function(option){
                    twoEchart1.setOption(option);
                });
            });
            //各市面积占比
            var twoEchart2 = echarts.init(document.getElementById('twoleft2'));
            configureCom.noloadpostAjax('/api/report/prj/totalAreaGroupByCity',baseQueryData).then(function(res){
                echartsCom.bing('',res.data).then(function(option){
                    twoEchart2.setOption(option);
                });
            });
            //各市投资额占比
            var twoEchart3 = echarts.init(document.getElementById('twoleft3'));
            configureCom.noloadpostAjax('/api/report/prj/prjTotalInvestmentGroupByCity',baseQueryData).then(function(res){
                echartsCom.bing('',res.data).then(function(option){
                    twoEchart3.setOption(option);
                });
            });
        };
        window.tworightFun = function(){
            //本月新增项目数
            configureCom.noloadpostAjax('/api/report/prj/currMonthNewPrjCount',baseQueryData).then(function(res){
                if(res.code == 0){
                    $('.tworight > div:nth-of-type(1) ul li:nth-of-type(1) span').html(res.data.prjCount+'个');
                    $('.tworight > div:nth-of-type(1) ul li:nth-of-type(2) span').html(res.data.bdfCount+'个');
                    $('.tworight > div:nth-of-type(1) ul li:nth-of-type(3) span').html(res.data.zpsCount+'个');
                }
            });
            //省级 - 装配式Z、被动房B 建筑走势trend - 折线图
            var myChart3 = echarts.init(document.getElementById('zbAnnualTrend'));
            configureCom.noloadpostAjax('/api/report/prj/zbAnnualTrend',{"provinceNum": "130000", "years": "2016-2020"}).then(function(res){
                var data = res.data;
                var legend = [];
                $.each(data,function(index, item){
                    legend.push(item.name);
                });
                var xseries = [];//x轴
                $.each(data[0].data,function(index,item){
                    xseries.push(item.name);
                });
                var series = [];
                $.each(data,function(i, item){
                    var a = {};
                    a.type = 'line';
                    a.name = item.name;
                    var arr = [];
                    $.each(item.data,function(j,val){
                        arr.push(parseInt(val.value));
                    });
                    a.data = arr;
                    series.push(a);
                });
                echartsCom.xian('', xseries, series).then(function(option){
                    myChart3.setOption(option);
                });
            });
            //
            var test1 = new Swiper('#test1', {
                navigation: {
                    nextEl: '#test1 .swiper-button-next',
                    prevEl: '#test1 .swiper-button-prev',
                },
            });
            // 工程规模分析
            var gmfx = echarts.init(document.getElementById('gmfx'));
            configureCom.noloadpostAjax('/api/report/prj/prjCountGroupByScale',baseQueryData).then(function(res){
                echartsCom.bing('',res.data).then(function(option){
                    gmfx.setOption(option);
                });
            });
            // 工程用途分析
            var ytfx = echarts.init(document.getElementById('ytfx'));
            configureCom.noloadpostAjax('/api/report/prj/purpose',baseQueryData).then(function(res){
                echartsCom.bing('',res.data).then(function(option){
                    ytfx.setOption(option);
                });
            });
            //中间
            var flag ={
                xmqs:false,
                jeqs:false,
                mjqs:false
            }

            var swiper = new Swiper('.ctop', {
                slidesPerView: 2,
                spaceBetween: 30,
                centeredSlides: true,
                loop: true,
                autoplay: {
                    delay: 5000,
                    disableOnInteraction: false,
                },
                on:{
                    init: function(){
                        //Swiper初始化了
                        ctopIndex = this.activeIndex;
                    },
                    slideChange: function(){
                        ctopIndex = this.activeIndex;
                        var name = this.$el.find('.swiper-slide').eq(ctopIndex).attr('data-name');

                        if(flag[name]) {
                            return;
                        }else{
                            flag[name]=true;
                        }

                        if(name == 'xmqs'){
                            window.twondxmFun();
                        }else if(name == 'jeqs'){
                            window.twondjeFun();
                        }else if(name == 'mjqs'){
                            window.twondmjFun();
                        }


                    },
                }
            });
            //各市项目分布--表格
            configureCom.noloadpostAjax('/api/report/prj/distribute',baseQueryData).then(function(res){
                var html = '';
                var data = res.data;
                $.each(data, function(i, item){
                    html += '<tr>' +
                        '        <td>'+(i+1)+'</td>' +
                        '        <td>'+item.district+'</td>' +
                        '        <td>'+item.prjCount+'</td>' +
                        '        <td>'+item.zpsCount+'</td>' +
                        '        <td>'+item.bdfCount+'</td>' +
                        '   </tr>'
                });
                $('#projectFb').html(html);
            });
            window.twondxmFun();
            window.twondjeFun();
            window.twondmjFun();
        };
        window.twondxmFun = function(){
            //年度项目
            var xmqs = echarts.init($('.layui-show .ctopline')[ctopIndex]);
            configureCom.noloadpostAjax('/api/report/prj/prjCountGroupByYear',{"provinceNum": "130000", "years": "2016-2020"}).then(function(res) {
                var data = res.data;
                var series = {};
                var xdata = [];
                $.each(data, function (i, item) {
                    xdata.push(item.name);
                });
                var arr = [];
                series.type = 'line';
                $.each(data, function (i, item) {
                    arr.push(parseInt(item.value));
                });
                series.data = arr;
                echartsCom.xian('', xdata, series).then(function (option) {
                    xmqs.setOption(option);
                });
            });
        };
        window.twondjeFun = function(){
            //年度金额
            var jeqs = echarts.init($('.layui-show .ctopline')[ctopIndex]);
            configureCom.noloadpostAjax('/api/report/prj/prjTotalInvestmentGroupByYear',{"provinceNum": "130000", "years": "2016-2020"}).then(function(res) {
                var data = res.data;
                var series = {};
                var xdata = [];
                $.each(data, function (i, item) {
                    xdata.push(item.name);
                });
                var arr = [];
                series.type = 'line';
                $.each(data, function (i, item) {
                    arr.push(parseInt(item.value));
                });
                series.data = arr;
                echartsCom.xian('', xdata, series).then(function (option) {
                    jeqs.setOption(option);
                });
            });
        };
        window.twondmjFun = function(){
            //年度面积
            var mjqs = echarts.init($('.layui-show .ctopline')[ctopIndex]);
            configureCom.noloadpostAjax('/api/report/prj/totalAreaGroupByYear',{"provinceNum": "130000", "years": "2016-2020"}).then(function(res) {
                var data = res.data;
                var series = {};
                var xdata = [];
                $.each(data, function (i, item) {
                    xdata.push(item.name);
                });
                var arr = [];
                series.type = 'line';
                $.each(data, function (i, item) {
                    arr.push(parseInt(item.value));
                });
                series.data = arr;
                echartsCom.xian('', xdata, series).then(function (option) {
                    mjqs.setOption(option);
                });
            });
        };







        $('.toptime').html(getNowDate());




        $('.thisclosebtn').on('click',function(){
            window.close();
        });
        $("body").on('mouseover','.cbot tbody tr ',function () {
            $(".cbot tbody tr").attr({"style":"background:#071c4b"});
        });
        $("body").on('mouseover','#onezhtj tbody tr ',function () {
            $(".cbot tbody tr").attr({"style":"background:#071c4b"});
        });
    });
</script>
</body>
</html>